<!DOCTYPE html>
<html>
<head>
	<% include link %>
	<link rel="stylesheet" type="text/css" href="/css/articles.css">
</head>
<body >
	<% include head %>
	<% include subtitle %>

	<div class="user-top-title container">
		<ol class="breadcrumb" style="background:#fff;">
			<li><a href="/">首页</a></li>
			<li><a href="#">文章</a></li>
			<li><a href="/articles/<%-article.tag%>"><%-tag%></a></li>
			<li class="active"><%-article.name%></li>
		</ol>
	</div>

	<div class="container">
		<div class="row">
				<div class="col-md-4 ">
					<div class="articles-pd">
						<a href="/userhome/<%-writer._id%>">
						<img src="<%-writer.headImgUrl%>" alt="..." class="img-circle user-head-img">
						</a>
						<p class="article-write-name"><%-writer.name%></p>

						<p class="article-write-motto">
							"<%-writer.motto%>"
						</p>
						<div class="article-write-bts">
							<% if(writer.name == user.name || !user.name) {%>
								<a href="javascript:void(0)" class="button button-primary button-rounded disabled" >关注</a>
								<a href="javascript:void(0)" class="button button-primary button-rounded disabled" >私信</a>
							<%} else {%>
								<a href="javascript:void(0)" class="fansbt button button-primary button-rounded" >关注</a>
								<a href="/user/message/<%-writer._id%>" class="button button-primary button-rounded ">私信</a>
							<% } %>
						</div>
					</div>
				</div>
				<div class=" col-md-8">
					<div class="articles-pd ">
						<div class="user-content-title">
							<p><%-article.name%></p>
							<p id="article-time"></p>
						</div>
						<p class="article-content"><%-article.content%></p>
						<div class="row article-content-foot">
							<div  class="col-sm-2 col-sm-offset-8 keep">
								<img  src="/images/keep.png">
								<p >收藏</p>
							</div>
							<div class="col-sm-2">
								<img  src="/images/heiheihei.png">
								<p >投币</p>
							</div>
						</div>
					</div>
				</div>
		</div>
	</div>


	<div class="container" id="showBtnDiv" style="clear:both;margin-top:50px;">
		<div class="row" >
			<div class="col-md-12">
				<button id="showComments" class="button button-glow button-border button-rounded 	button-primary" style="margin:0px auto;display:block;">查看与评论</button>
			</div>
		</div>
	</div>
	<div class="container comments" style="display:none;margin-top:30px;">
		<div class="row">
				<div class="col-sm-1">
					<img src="<%-user.headImgUrl%>" style="display: block; height:70px;margin:0px auto;margin-top:20px;" class="img-circle">
				</div>
				<div class="col-sm-9">
					<textarea type="textarea" class="form-control" style="height:70px;margin-top:20px;"	placeholder="content"></textarea>
				</div>
				<div class="col-sm-2">
				<button style="height:70px;display:block;margin-top:20px;" class="btn-block button button-primary button-rounded submit">
					发表评论
				</button>
				</div>
		</div>
		<div style="height:50px;" class="text">
			
		</div>
	</div>

	<% include foot %>
</body>
<script src="/js/ClientComments.js"></script>
<script>

	var isFans,fansPost,isKeep;
	if('<%-isFans%>'=="true"){
		isFans  = true;
		fansPost = '/articles/read/refans';
		$('.fansbt').html('已关注');
	} else {
		isFans = false;
		fansPost = '/articles/read/addfans';
		$('.fansbt').html('关注');
	}

	var keepAT ="<%-user.keepAT%>";
	keepAT = keepAT.split(",")
	if($.inArray("<%-article._id%>",keepAT)>=0){
		$('.keep p').html("已收藏");
		$('.keep img').attr("src","/images/keepon.png");
		isKeep = true;
	} else {
		$('.keep p').html("收藏");
		isKeep = false;
	}


	function getComents(){
		$.ajax({
			url:'/articles/read/comments/<%-article._id%>',
			type:'get',
			success:function(obj){
				var arr = obj[0].comments
				for (var i = 0; i < arr.length; i++) {
					insertComments(arr[i])
				}
			}
		})
	}

	function sendComment(json){
		$.ajax({
			url:'/articles/read/comment/<%-article._id%>',
			type:'post',
			data:json,
			success:function(data){
				$('textarea').val('')
				insertComments(json)
			}
		})
	}

 	getTime();

	function getTime(){
		var time = <%-article.upTime%>;
		time = parseInt(time);
		time = new Date(time).format("yyyy-MM-dd hh:ss");
		$("#article-time").html("更新时间:"+time);
	}

	$('.keep').click(function(){
		if (user===null) {
			alert('please login')
		}else{
			if(isKeep){
				$.ajax({
					url:'/articles/read/delkeep/<%-article._id%>',
					type:'delete',
					success:function(data){
						$('.keep p').html("收藏");
						$('.keep img').attr("src","/images/keep.png");
						isKeep = false;
						Messenger().post({
								  message:"取消收藏成功!",
								  hideAfter: 1,
						});
					}
				})
			} else {
				$.ajax({
					url:'/articles/read/keep/<%-article._id%>',
					type:'get',
					success:function(data){
						$('.keep p').html("已收藏!");
						$('.keep img').attr("src","/images/keepon.png");
						isKeep = true;
						Messenger().post({
								  message:"收藏成功",
								  hideAfter: 1,
						});
					}
				})
			}
		}
	});

	if ($('.fansbt')) {
		$('.fansbt').click(function() {
			var self = $(this);
			var fid = '<%-user._id%>';
			var name = '<%-writer.name%>';
				$.ajax({
					url:fansPost,
					type:'post',
					data:{
						addfans:{
						 	'name': name,
						 	'FID': fid,
						}
					},
					success:function(data){
						window.location.reload();
					}
				});
		});
	}

	</script>
</html>